import bb.cascades 1.2
import bb.cascades.maps 1.2
import bb.cascades.places 1.0

import QtMobility.sensors 1.2
import QtMobilitySubset.location 1.1
 
Page {
    property double xAzimuth: 0
    property int updateGPSInterval: 1000
    property bool updateGPS: true
    property bool followCompass: true
    property bool confirmRoute: false
    /**
     * 0 = start (where are you going ist sichtbar)
     * 1 = route(ndauer) wird angezeigt und wartet auf bestaetigung
     * 2 = route wurde gestartet (going home)
     */
    property int status : 0
    
    property string hours: "00"
    property string minutes: "00"
    property string seconds: "00"
    function updateTime() {
        var timestring = hours + ":" + minutes + ":" + seconds;
        var value = durationpicker.dateFromTime(timestring);
        durationpicker.setValue(value);
    }
    onSecondsChanged: {
        // sekunden werden als letztes aktualisiert
        updateTime();
    }
    Container {
        id: root
        horizontalAlignment: HorizontalAlignment.Fill
        verticalAlignment: VerticalAlignment.Fill
        layout: DockLayout {}
        Container {
            horizontalAlignment: HorizontalAlignment.Fill
            verticalAlignment: VerticalAlignment.Fill
            Container {
                id: serachandtitle
                background: Color.create("#0098F0")
                visible: status == 0 || status == 1
                horizontalAlignment: HorizontalAlignment.Fill
                layout: StackLayout {
                    orientation: LayoutOrientation.TopToBottom
                }
                layoutProperties: StackLayoutProperties {
                    spaceQuota: -1
                }
                topPadding: 15
                rightPadding: 15
                leftPadding: 15
                bottomPadding: 15
                TextField {
                    id: placebox
                    visible: status == 0
                    horizontalAlignment: HorizontalAlignment.Fill
                    onFocusedChanged: {
                        if (focused) {
                            var place = placepicker.show ()
                            if (place) {
                                placebox.text = place.name
                                console.log(
                                place.latitude, place.longitude);
                                app.updateDestinationLocation(place.latitude, place.longitude, place.name);
                            } else {
                                placebox.text = ""
                            }
                            placebox.loseFocus();
                        }
                    }
                    hintText: qsTr("Where are you going?")
                }

                DateTimePicker {
                    visible: status == 1
                    id: durationpicker
                    expanded: false
                    minuteInterval: 1
                    mode: DateTimePickerMode.Timer
                    accessibilityMode: A11yMode.Default
                    onValueChanged: {
                        var nseconds = (value.getHours() * 60 + value.getMinutes()) * 60 + value.getSeconds();
                        app.onRouteSetDuration(nseconds);
                    }
                    title: qsTr("Duration")
                }
                
                attachedObjects: [
                    PlacePicker {
                        id: placepicker
                    }
                ]
            }
            MapView {
                layoutProperties: StackLayoutProperties {
                    spaceQuota: 1
                }
                objectName: "mapViewObj"
                horizontalAlignment: HorizontalAlignment.Fill
                verticalAlignment: VerticalAlignment.Fill
                id: mapview
                latitude: 53.5523786
                longitude: 9.9111201
            }
        }
        Container {
            layout: DockLayout {}
            overlapTouchPolicy: OverlapTouchPolicy.Allow
            horizontalAlignment: HorizontalAlignment.Fill
            verticalAlignment: VerticalAlignment.Fill
            Container {
                overlapTouchPolicy: OverlapTouchPolicy.Allow
                id: confirmroutelayer
                visible: status == 1
                bottomPadding: 20
                leftPadding: 20
                rightPadding: 20
                layout: DockLayout {}
                horizontalAlignment: HorizontalAlignment.Fill
                verticalAlignment: VerticalAlignment.Fill
                Container {
                    horizontalAlignment: HorizontalAlignment.Center
                    verticalAlignment: VerticalAlignment.Bottom
                    layout: StackLayout {
                        orientation: LayoutOrientation.LeftToRight
                    }
                    Button {
                        preferredWidth: 50
                        text: qsTr("Cancel")
                        imageSource: "asset:///images/icons/ic_clear_red.png"
                        horizontalAlignment: HorizontalAlignment.Center
                        onClicked: {
                            status = 0;
                            app.onResetRoute();
                        }
                    }
                    Button {
                        preferredWidth: 50
                        text: qsTr("Start Route")
                        imageSource: "asset:///images/icons/ic_done_green.png"
                        horizontalAlignment: HorizontalAlignment.Center
                        onClicked: {
                            status = 2;
                            app.onRouteStart();
                        }
                    }
                }
            }
            Container {
                id: goinghomelayer
                visible: status == 2
                verticalAlignment: VerticalAlignment.Fill
                horizontalAlignment: HorizontalAlignment.Fill
                layout: DockLayout {}
                
                CountdownTimer {
                    horizontalAlignment: HorizontalAlignment.Fill
                    textcolor: Color.Gray
                    background: Color.Black
                    id: timer
                    pHours: hours
                    pMinutes: minutes
                    pSeconds: seconds
                }
                Container {
                    horizontalAlignment: HorizontalAlignment.Center
                    verticalAlignment: VerticalAlignment.Bottom
                    Button {
                        text: qsTr("Stop")
                        onClicked: {
                            console.log("STOP!");
                        }
                    }
                    bottomPadding: 20
                }
            }
        }
    }
    onCreationCompleted: {
        mapview.setFollowedId("device-location-id");
    }
    attachedObjects: [
        Compass {
            active: followCompass
            axesOrientationMode: Compass.UserOrientation
            alwaysOn: false
            onReadingChanged: {
                mapview.setHeading(360 - reading.azimuth);
            }
        }
        /*,PositionSource {
            id: positionSource
            updateInterval: updateGPSInterval
            active: updateGPS
            onPositionChanged: {
                app.updateDeviceLocation(positionSource.position.coordinate.latitude, positionSource.position.coordinate.longitude);
            }
        }*/
    ]
}